<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>{$title}</title>
	{literal}
	<style type="text/css">
	table{width:500px;height:300px;border-collapse:collapse;margin:30px auto;}
	table td{text-align:center;}
	#show{width:900px;height:30px;margin:5px auto;}
	</style>
	{/literal}
</head>
<body>
	<table border='1'>
		<tr>
			<td>ID</td>
			<td>用户名</td>
			<td>密码</td>
			<td>年龄</td>
			<td>操作</td>
		</tr>

		{foreach $res as $k=>$v}
			<tr id='trs'>
				<td>{$v['id']}</td>
				<td>{$v['username']}</td>
				<td>{$v['password']}</td>
				<td>{$v['age']}</td>
				<td><a href='./index.php?c=User&a=edit&id={$v["id"]}'>修改</a>  <a href='./index.php?c=User&a=delete&id={$v["id"]}'>删除</a></td>
			</tr>
		{/foreach}


	</table>
	<div id='show'>
		{$show}
	</div>

	<script type="text/javascript" src='./Public/js/jquery-1.8.3.min.js'></script>

	<script type="text/javascript">
	
		$('#trs td:nth-child(2)').dblclick(function(){

			var v = $(this).html();
			var input = $('<input type="text" />');
			$(this).empty();
			$(this).append(input);

			input.focus();
			input.val(v);
			input.select();

			var td = $(this);

			input.blur(function(){

				var newV  = $(this).val();

				var id = $(this).parents('tr').find('td').eq(0).html();
				{literal}
				$.post('index.php?c=User&a=Update',{username:newV,id:id},function(data){

					if(data == '1'){

						td.html(newV);
					} else {

						td.html(v);
					}
				})
				{/literal}

			})
		})

	</script>
</body>
</html>